<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  <title>欢迎名片百度地图</title>
  <style type="text/css">
    body,
    html,
    #allmap {
      width: 100%;
      height: 100%;
      overflow: hidden;
      margin: 0;
      font-family: "微软雅黑";
    }

    #result {
      width: 100%;
      font-size: 12px;
    }

    ul,
    li {
      list-style: none;
      margin: 0;
      padding: 0;
      float: left;
    }

    .tabars {
      display: flex;
      width: 335px;
      /*height:800px;*/
      position: fixed;
      top: 60px;
      left: 20px;
      z-index: 99;
    }

    .tabarsRight {
      width: 335px;
      flex: 1;
      background-color: #fff;
      border-radius: 24px;
    }

    .stationline {
      border-left: 5px solid #007AFF;
      padding-left: 4px;
      font-size: 16px;
      display: inline-block;
    }

    .borders {
      border-bottom: 1px solid #F1F1F1;
      box-sizing: border-box;
    }

    .jistation {
      padding: 28px 28px 12px 28px;
    }

    .xianstation {
      padding: 12px 28px 12px 28px;
    }

    .jistation .layui-form-switch {
      float: right;
      margin-top: 0;
      height: 21px;
      width: 38px;
    }

    .jistation .layui-form-onswitch {
      background: #007AFF;
      border-color: #007AFF;
    }

    .caller-seach {
      margin-top: 20px;
      background: #F1F1F1;
      border-radius: 15px;
      padding-left: 12px;
    }

    .caller-icon {
      font-size: 14px !important;
      margin-right: 2px;
      vertical-align: -2px;
    }

    .xianstation .input-text {
      display: inline-block;
      padding-left: 0;
      width: 74%;
      background: transparent;
      font-size: 12px;
      height: 30px;
      line-height: 30px;
      color: #8F8F8F;
      border-width: 0;
    }

    .search-btn {
      float: right;
      margin: 7px 12px 0 0;
      font-size: 12px;
      color: #1681FB;
      cursor: pointer;
    }

    .tabar {
      width: 88px;
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 20px;
      text-align: center;
    }

    .tabar img {
      width: 40px;
      height: 40px;
    }

    .tabara {
      width: 88px;
      margin-top: 15px;
    }

    .tabarb {
      font-size: 13px;
      font-weight: 400;
      color: #454545;
      line-height: 18px;
      margin-top: 10px;
    }

    .bottom-add {
      border-top: 1px solid #EDEDED;
      box-sizing: border-box;
      position: fixed;
      bottom: 0;
      width: 312px;
      text-align: right;
      padding: 10px 0 12px 0;
      background: #FFFFFF;
    }

    .btns {
      width: 90px;
      height: 36px;
      line-height: 36px;
      border: none;
      border-radius: 22px;
      color: #FFFFFF;
      font-size: 14px;
      cursor: pointer;
    }

    .blue {
      background: #007AFF;
    }

    .green {
      background: green;
      margin-left: 8px;
    }

    .orange {
      background: #E7A53A;
      margin-left: 8px;
    }

    .addicon {
      font-size: 14px;
      color: #FFFFFF;
    }

    .layui-form-checked[lay-skin=primary] i {
      background: #007AFF !important;
      border-color: #007AFF !important;
    }

    .laytrees {
      margin-top: 12px;
    }


    /*设置表单的样式*/
    .formedit {
      padding: 0 20px 0 18px;
    }

    .formlabel {
      float: left;
      padding-top: 2px;
      color: #656565
    }

    .formedit .layui-form-radio>i:hover,
    .formedit .layui-form-radioed>i {
      color: #007AFF;
      font-size: 16px;
      margin-right: 4px;
    }

    .formedit .layui-form-select {
      margin-right: 25px;
    }

    .layui-form-select dl {
      max-height: 170px !important;
    }

    .formedit .layui-form-select dl dd.layui-this {
      background: #007AFF;
    }

    .formedit .layui-form-select .layui-input {
      padding: 8px;
    }

    .formedit .layui-form-select dl {
      top: 28px;
      padding: 0;
    }

    .formedit .layui-form-select dl dd,
    .formedit .layui-form-select dl dt {
      line-height: 26px;
      font-size: 12px;
    }

    .formedit .layui-input,
    .formedit .layui-form-item .layui-input-inline {
      width: auto;
    }

    .formedit .layui-form-radio {
      line-height: 26px;
      margin: 0;
    }

    .formedit .layui-form-radio>i {
      font-size: 16px;
      margin-right: 4px;
    }

    .formedit .layui-form-radio * {
      color: #8A8A8A;

    }

    .formedit .inputblock {
      margin-left: 0;
      min-height: 26px;
    }

    .formedit .layui-input,
    .layui-select {
      width: 160px;
      height: 26px;
      line-height: 26px;
      font-size: 12px;
      color: #363636
    }

    .formedit .layui-form-switch {
      margin-top: 0;
      width: 38px;
      height: 21px;
      line-height: 21px;
      padding: 0;
    }

    .formedit .layui-form-onswitch {
      background: #007AFF;
      border-color: #007AFF;
    }

    .formedit .wth104 {
      width: 104px
    }

    .formedit .mat4 {
      margin-top: 4px;
    }

    .formedit .fr {
      float: right
    }

    .formedit .btnsalign {
      text-align: center;
    }

    .formedit .layui-btn {
      width: 79px;
      height: 26px;
      background: #218EEB;
      line-height: 26px;
      border-radius: 13px;
      font-size: 12px;
    }

    .formedit .disableinput {
      background: #f2f2f2;
    }

    .formedit .layui-tab {
      margin: 0;
    }

    .formedit .layui-tab-brief .layui-tab-title {
      width: 100%;
    }

    .formedit .layui-tab-brief>.layui-tab-title .layui-this {
      color: #007fff;
    }

    .formedit .layui-tab-brief>.layui-tab-more li.layui-this:after,
    .formedit .layui-tab-brief>.layui-tab-title .layui-this:after {
      border-bottom: 2px solid #007fff;
    }

    .formedit .contentnone {
      font-size: 14px;
      color: #aeaeae;
    }

    .formedit .textareas {
      height: 165px;
      resize: none;
    }

    .formedit .step1heigth {
      height: 252px;
      padding-top: 18px;
    }

    .formedit .step2wid {
      height: 270px;
    }

    .formedit .layui-tab-content {
      padding: 10px 0;
    }

    .concentration {
      width: 155px;
      height: 51px;
      background: #404244;
      border-radius: 0px 0px 33px 0px;
      opacity: 0.8;
      position: fixed;
      top: 0;
      left: 0;
      font-size: 30px;
      font-family: PingFangTC-Regular, PingFangTC;
      color: #FFFFFF;
      line-height: 34px;
      letter-spacing: 2px;
      line-height: 51px;
    }

    .cc {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      background-color: #FF4747;
      color: #fff;
      text-align: center;
      line-height: 50px;
      font-size: 50px;
      position: fixed;
      top: 10px;
      right: 10px;
    }

    dd {
      color: #333;
    }

    .contentd .layui-input {
      width: 260px;
      height: 25px;
      background: #F1F1F1;
      border-radius: 15px;
      margin-left: 8px;
      padding-left: 28px;
    }

    .personTab {
      display: flex;
      border-bottom: 1px solid #E7E7E7;
    }

    .personType {
      width: 45%;
      height: 36px;
      line-height: 36px;
      text-align: center;
    }

    .layui-forma {
      margin-top: 20px;
    }

    .personChoosed {
      color: #007AFF;
      border-bottom: 2px solid #007AFF;
    }

    .zbPerson {
      display: flex;
      align-items: center;
      font-size: 12px;
      padding-left: 8px;
    }

    .layui-form .layui-inputzb {
      width: 80px;
    }

    .referencePoint {
      margin-left: 10px;
      color: #007AFF;
      font-size: 12px;
    }

    .pointSearch {
      width: 48px;
      height: 25px;
      background: #007AFF;
      border-radius: 15px;
      text-align: center;
      line-height: 25px;
      color: #fff;
      margin-left: 8px;
    }

    .layui-search {
      position: absolute;
      font-size: 12px;
      font-weight: 400;
      color: #1681FB;
      top: 4px;
      right: 10px;
      cursor: pointer;
    }

    .personChoosed {
      color: #007AFF;
      border-bottom: 2px solid #007AFF;
    }

    .searchFrame {
      width: 260px;
      height: 25px;
      background: #F1F1F1;
      border-radius: 15px;
      margin-left: 8px;
      padding-left: 35px;
      border: none;
    }

    .rangeSet {
      height: 25px;
      width: 80px;
      background: #F1F1F1;
      border-radius: 15px;
      margin-left: 8px;
      padding-left: 14px;
      border: none;
    }

    .line {
      width: 100%;
      height: 1px;
      background-color: #E7E7E7;
      margin-top: 15px;
    }

    .zbform {
      padding-bottom: 20px;
      border-bottom: 1px dotted #E7E7E7;
    }

    .layui-form>ul {
      clear: both;
      margin-top: 5px;
      margin-left: 20px;
    }

    .layui-form>ul li {
      clear: both;
      margin-top: 5px;
    }

    .layui-form>ul li {
      clear: both;
      position: relative;
      display: flex;
      align-items: center;
    }

    .layui-form>ul li span {
      display: inline-block;
      width: 235px;
      height: 30px;
      line-height: 30px;
      margin-left: 10px;
      border-bottom: 1px solid #ECECEC;
      color: #454545;
    }

    .layui-form>ul li .choose span {
      display: inline-block;
      width: auto;
      height: auto;
      margin-left: 0;
      line-height: 20px;
      border-bottom: none;
      font-size: 13px;
      color: #4B4B4B;
    }

    .layui-form>ul .personDetailsz {
      width: 250px;
      display: flex;
      justify-content: space-between;
    }

    .layui-form>ul .personDetailsz span {
      width: auto;
    }

    .distancesz {
      margin-left: 10px;
    }

    .demo-tree-more {
      margin-left: 20px;
      height: 390px;
    }
  </style>
  <!-- <link rel="stylesheet" type="text/css" href="../../css/mapstyle.css">
    <link rel="stylesheet" type="text/css" href="../../css/xcConfirm.css"/>
    <script src="../../js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>-->

  <link href="../../layui256/css/layui.css" rel="stylesheet" type="text/css">
  <script src="../../layui256/layui.js"></script>
  <!--    <script src="../../layui/layui-xtree.js"></script>-->
  <link href="../../css/style.css" rel="stylesheet" type="text/css">
  <script src="../../js/jquery-1.8.3.js"></script>
  <script src="../../js/util.js"></script>



  <!-- <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=nSGoPNzNrehEaGBst1TZzklH"></script> -->
  <!--加载鼠标绘制工具-->
  <!-- <script type="text/javascript"
    src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
  <link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" /> -->
  <!--加载检索信息窗口-->
  <!-- <script type="text/javascript"
    src="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js"></script>
  <link rel="stylesheet" href="http://api.map.baidu.com/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css" /> -->
  <!--测算工具类-->
  <!-- <script type="text/javascript" src="http://api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script>
  <script type="text/javascript" src="http://api.map.baidu.com/library/Heatmap/2.0/src/Heatmap_min.js"></script> -->
  <!-- <script src="http://mapv.baidu.com/build/mapv.min.js"></script> -->
  
  <!-- 自定义添加script -->
  <script type="text/javascript">
     !function addScript () {
        var pathObj = {
          scriptList: [
            "/api?v=2.0&ak=nSGoPNzNrehEaGBst1TZzklH",
            //加载鼠标绘制工具
            "/library/DrawingManager/1.4/src/DrawingManager_min.js",
            // -加载检索信息窗口
            "/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.js",
            //测算工具类
            "/library/GeoUtils/1.2/src/GeoUtils_min.js",
            "/library/Heatmap/2.0/src/Heatmap_min.js",
          ],
          scriptListTwo: [
            "/build/mapv.min.js"
          ],
          link: [
            "/library/SearchInfoWindow/1.4/src/SearchInfoWindow_min.css",
            "/library/DrawingManager/1.4/src/DrawingManager_min.css"
          ]
        }
        var urlArr = window.sessionStorage.getItem('urlStr').split(";");
        var oHead = document.getElementsByTagName('HEAD').item(0);
        pathObj.scriptList.forEach(element => {
          var oScript = document.createElement("script");
          oScript.type = "text/javascript";
          oScript.src = urlArr[0] + element;
          oHead.appendChild(oScript);
        });
        pathObj.scriptListTwo.forEach(element => {
          var oScript = document.createElement("script");
          oScript.type = "text/javascript";
          oScript.src = urlArr[1] + element;
          oHead.appendChild(oScript);
        });
        pathObj.link.forEach(element => {
          var oLink = document.createElement("link");
          oLink.type = "stylesheet";
          oLink.href = urlArr[0] + element;
          oHead.appendChild(oLink);
        });
      }();

  </script>
</head>

<body>
  <div id="allmap"></div>
  <div id="loadingDiv" class="load-white-bg hide">
    <span class="qloading">正在加载...</span>
  </div>
  <div class="cc">×</div>
</body>

</html>
<script type="text/javascript">
  $(function () {
    $('.tabars').css('height', document.body.clientHeight + 'px');
    $('#test12').css({ 'height': document.body.clientHeight - 294 + 'px', 'overflow-y': 'auto' });
  })
  var map = null;
  var circleOverlays = [];
  var rectangleOverlays = [];
  var pointsOverlays = [];
  var latitudeAndLongitudeValueArr = [];
  var pointName = [];
  var mgrId = "";
  var linePointNames = [];
  var referencePointArr = [];
  var assignPersonPoints = [];
  var assignRangePersonPoints = [];
  var circles = [];
  var reset;

  layui.use(['tree', 'util', 'table', 'form', 'jquery', 'element', 'layer', 'laydate'], function () {
    var form = layui.form;
    var $ = layui.$;
    var util = layui.util;
    var layer = layui.layer;
    var tree = layui.tree;
    var laydate = layui.laydate;
    var element = layui.element;//tab
    let treeData = [];
    var switchnum = '', sendnum = '', tabindex = 0;//数量
    var title = '项目基本信息';

    var flagMgr;//项目标识  1为正常应急项目  2为盱眙供电局项目
    laydate.render({
      elem: '#startTime'
      , type: 'datetime'
      , min: minDate()
      , value: getRecentDay(0)
    });
    laydate.render({
      elem: '#endTime'
      , type: 'datetime'
      , min: minDate()
      , value: getRecentDay(1 / 96)
    });

    function minDate () {
      var now = new Date();
      return now.getFullYear() + "-" + (now.getMonth() + 1) + "-" + now.getDate() + " " + now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds();
    }

    function getRecentDay (day) {
      var today = new Date();
      var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
      today.setTime(targetday_milliseconds);
      var tYear = today.getFullYear();
      var tMonth = today.getMonth();
      var tDate = today.getDate();
      var tHours = today.getHours();
      var tMinutes = today.getMinutes();
      var tSeconds = today.getSeconds();
      tMonth = doHandleMonth(tMonth + 1);
      tDate = doHandleMonth(tDate);
      tHours = doHandleMonth(tHours);
      tMinutes = doHandleMonth(tMinutes);
      tSeconds = doHandleMonth(tSeconds);

      return tYear + "-" + tMonth + "-" + tDate + ' ' + tHours + ':' + tMinutes + ':' + tSeconds;
    }

    function doHandleMonth (month) {
      var m = month;
      if (month.toString().length == 1) {
        m = "0" + month;
      }
      return m;
    }

    //发送短信
    form.on('switch(sendNum)', function (data) {
      sendnum = data.elem.checked;
      //判断是否需要填写数据
      if (sendnum) {
        $('#threshold').attr("disabled", false).removeClass("disableinput");
      } else {
        $('#threshold').attr("disabled", true).addClass("disableinput");
        $('#threshold').attr("value", "");
      }
    });

    //tab切换
    element.on('tab(docDemoTabBrief)', function (data) {
      tabindex = data.index;
      console.info(tabindex);
    });
    //上一步
    $("#prev").click(function () {
      if ($('#step2').is(':visible')) {
        $("#submit").text('下一步');
        $("#step1").css('display', 'block');
        $("#step2").css('display', 'none');

      } else {
        layer.closeAll();
      }
    });
    //发送模板
    form.on('switch(switchNum)', function (data) {
      switchnum = data.elem.checked;
      //判断是否需要填写数据
      if (switchnum) {
        $('#cycleThreshold').attr("disabled", false).removeClass("disableinput");
      } else {
        $('#cycleThreshold').attr("disabled", true).addClass("disableinput");
        $('#cycleThreshold').attr("value", "");
      }
    });

    //开始时间
    let start_a = laydate.render({
      elem: '#startTime',
      trigger: 'click',
      theme: '#007AFF',
      type: 'datetime',
      done: function (value, date, endDate) {
        end.config.min = {
          year: date.year,
          month: date.month - 1,
          date: date.date
        }; //开始日选好后，重置结束日的最小日期
        end.config.value = {
          year: date.year,
          month: date.month - 1,
          date: date.date,
        }; //将结束日的初始值设定为开始日
      }
    });

    //结束时间
    let end = laydate.render({
      elem: '#endTime',
      trigger: 'click',
      theme: '#007AFF',
      type: 'datetime',
      done: function (value, date, endDate) {
        start_a.config.max = {
          year: date.year,
          month: date.month - 1,
          date: date.date,
        }; //结束日选好后，重置开始日的最大日期
      }
    });

    //提交
    form.on('submit(submitOk)', function (data) {



      // console.log(JSON.stringify(data.field));//取的值可以供参考
      if ($('#step2').is(':visible')) { //如果是点击确定的时候
        data.field.open = data.field.open ? "true" : "false";
        data.field.close = data.field.close ? "true" : "false";

        var isThreshold = 0;
        $("input:checkbox[name='isThreshold']:checked").each(function () {
          isThreshold += parseInt($(this).val());
        });
        var cycleThreshold = 0;
        var cycle;
        if (isThreshold == 2 || isThreshold == 3) {
          //var cycle = $("input[name='cycle']:checked").val();     //发送周期
          cycle = $("#cycle").val();
          cycleThreshold = $("#cycleThreshold").val();

        };
        console.log(JSON.stringify(data.field));
        console.log(tabindex);
        submitMgrInfo();
      }
      var startTime = $("#startTime").val();
      var endTime = $("#endTime").val();
      if (startTime >= endTime) {
        layer.msg("发送结束时间不能小于等于开始时间");
        return false;
      }
      //判断按钮的字
      $("#submit").text('确定');
      $("#step1").css('display', 'none');
      $("#step2").css('display', 'block');
      //修改弹出框title
      $(".layui-layer-title")[0].innerText = "项目信息配置";

      console.log(tabindex);
      return false;
    });


    //判断输入
    form.verify({
      //项目名称
      name: function (value) {
        if (value == '') {
          return '请输入项目名称';
        }
        if (value.indexOf("-") > 0) {
          return "项目名称中请勿包含  '-' !";
        }
      },
      //地市
      cityId: function (value) {
        if (value == '') {
          return '请选择地市';
        }
      },
      //县区
      countyId: function (value) {
        if (value == '') {
          return '请选择市区';
        }
      },
      //开始时间
      startTime: function (value) {
        if (value == '') {
          return '请选择开始时间';
        }
      },
      //结束时间
      endTime: function (value) {
        if (value == '') {
          return '请选择结束时间';
        }

      },
      threshold: function (value) {
        if ((sendnum && value == '') || (sendnum && value <= 0)) {
          return '请输入正确的发送总量';
        }
      },
      cycleThreshold: function (value) {
        console.info(switchnum);
        if ((switchnum && value == '') || (switchnum && value <= 0)) {
          return '请输入正确的周期发送数量';
        }
      },
      content: function (value) {
        if ($('#step2').is(':visible') && value == '' && tabindex == 0) {
          return '请输入发送内容';
        }
      },
    });


    for (var i = 0; i < 4; i++) {
      $(".content").eq(i).hide();
    }
    $(".content").eq(0).show();
    $(".tabar").click(function () {
      for (var i = 0; i < 4; i++) {
        $(".content").eq(i).hide();
        $(".tabar").eq(i).css("backgroundColor", "#F9F9F9")
      }
      $(".content").eq($(".tabar").index(this)).show();
      $(this).css("backgroundColor", "#fff")
    })
    //swtich的值
    form.on('switch(switchTest)', function (data) {
      console.log(data.elem); //得到checkbox原始DOM对象
      console.log(data.elem.checked); //开关是否开启，true或者false
      console.log(data.value); //开关value值，也可以通过data.elem.value得到
      console.log(data.othis); //得到美化后的DOM对象
      var x = data.elem.checked;
      console.log(x);
    })
    $(".cc").click(function () {
      location.href = "xuyiIndex.html";
    });
    //搜索框的值
    $('#query').on('click', function () {
      var name = $("#inputs-name").val();
      console.log("name" + name);
      treeData = test(name);
      console.log(JSON.stringify(treeData));
      //重载实例
      tree.reload('demoId1', {
        elem: '#test12' //默认是点击节点可进行收缩
        , data: treeData
        , edit: false
        , showCheckbox: true  //是否显示复选框
        , oncheck: function (obj) {
          console.log(obj.data); //得到当前点击的节点数据
          console.log(obj.checked); //得到当前节点的展开状态：open、close、normal
          console.log(obj.data.checked); //得到当前节点元素
        }
      });
    });

    //判断项目名称是否重复
    function judgeMgrName (mgrName) {
      var url = '/util/getMgrName';
      $.ajax({
        url: url,
        type: 'post',
        async: false,
        data: "mgrName=" + mgrName,
        success: function (json) {
          flagMgr = json.data;
        }, error: function () {
          layer.msg('系统异常，请联系管理员处理!');
        }
      }
      );
    }


    var initialFunc = function () {
      // 创建Map实例,设置地图允许的最小/大级别
      map = new BMap.Map("allmap", { enableMapClick: false });
      //开启滚轮缩放
      map.enableScrollWheelZoom(true);
      map.centerAndZoom("南京市");
      map.setMaxZoom(18);
      map.setMinZoom(11);
      //右下角添加控件
      map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_BOTTOM_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL }));
      function ZoomControl () {
        // 默认停靠位置和偏移量
        this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
        this.defaultOffset = new BMap.Size(0, 80); // 距离左上角位置
      }
      ZoomControl.prototype = new BMap.Control();

      // 自定义控件必须实现自己的initialize方法,并且将控件的DOM元素返回
      // 在本方法中创建个div元素作为控件的容器,并将其添加到地图容器中
      ZoomControl.prototype.initialize = function (map) {
        // 创建一个DOM元素
        var div = document.createElement("div");
        // 添加文字说明
        div.appendChild(document.createTextNode("保存"));
        // 设置样式
        div.style.cursor = "pointer";
        div.style.border = "1px solid gray";
        div.style.backgroundColor = "white";
        div.style.width = "55px";
        div.style.height = "45px";
        div.style.textAlign = 'center';
        div.style.backgroundColor = '#2e84b5';
        div.style.color = '#ededed';
        div.style.lineHeight = '45px';
        div.style.textAlign = 'center';
        div.style.borderRadius = '10px';
        // 绑定事件
        div.onclick = function (e) {
          if ((circleOverlays.length + rectangleOverlays.length) === 0) {
            layer.open({
              title: "提示"
              , type: 1
              , offset: 'auto'
              , id: 'layerDemo' //防止重复弹出
              , content: '<div style="padding: 20px 80px;"><span>请先选取发送区域再进行保存</span></div>'
              , btn: '关闭'
              , btnAlign: 'c' //按钮居中
              , shade: 0 //不显示遮罩
              , yes: function () {
                layer.closeAll();
              }
            });
          } else {
            var txt = "目前圈画" + (circleOverlays.length + rectangleOverlays.length) + "个区域，将保存发送范围，请确认！";
            layer.open({
              type: 1
              , offset: 'auto'
              , id: 'layerDemo' //防止重复弹出
              , content: '<div style="padding: 20px 80px;"><span>' + txt + '</span></div>'
              , btn: ['确定', '取消']
              , yes: function () {
                latitudeAndLongitudeValueArr.length = 0;
                for (let i = 0; i < circleOverlays.length; i++) {
                  latitudeAndLongitudeValueArr.push(circleOverlays[i].getCenter().lng + "," + circleOverlays[i].getCenter().lat + "+" + circleOverlays[i].getRadius());
                }
                for (let i = 0; i < rectangleOverlays.length; i++) {
                  latitudeAndLongitudeValueArr.push(getPoints(rectangleOverlays[i]));
                }

                console.info(JSON.stringify(latitudeAndLongitudeValueArr));
                var json;
                let jsonParams = {
                  'mgrId': mgrId
                  , 'longAndLatListInfo': JSON.stringify(latitudeAndLongitudeValueArr)
                };
                var url = '/sendRange/getStations';
                $.ajax({
                  contentType: "application/json;charset=UTF-8",
                  type: 'post',
                  url: url,
                  data: JSON.stringify(jsonParams),
                  dataType: 'json',
                  async: false,
                  success: function (resp) {
                    console.info(JSON.stringify(resp));
                    if (resp.retCode == "0") {
                      json = resp.data;
                      mgrId = json.mgrId;
                      var stationIds = json.stationIds;
                      var msg = '所选中区域共有' + json.stationCount + '个基站';
                      layer.closeAll();
                      layer.open({
                        title: "提示"
                        , type: 1
                        , offset: 'auto'
                        , id: 'layerDemo2' //防止重复弹出
                        , content: `<div style="padding: 20px 80px;"><span>${msg}</span></div>`
                        , btn: ['确定', '取消']
                        , btnAlign: 'c' //按钮居中
                        , shade: 0 //不显示遮罩
                        , yes: function () {
                          let jsonParams = {
                            'mgrId': mgrId,
                            'range': JSON.stringify(latitudeAndLongitudeValueArr),
                            'stationIds': stationIds
                          };
                          $.ajax({
                            contentType: "application/json;charset=UTF-8",
                            type: 'post',
                            url: '/sendRange/createRange',
                            data: JSON.stringify(jsonParams),
                            dataType: 'json',
                            async: false,
                            success: function (resp) {
                              if (resp.retCode === "0") {
                                layer.open({
                                  title: "提示"
                                  , type: 1
                                  , offset: 'auto'
                                  , id: 'layerDemo3' //防止重复弹出
                                  , content: `<div style="padding: 20px 80px;"><span>${msg}已成功保存</span></div>`
                                  , btn: '确定'
                                  , btnAlign: 'c' //按钮居中
                                  , shade: 0 //不显示遮罩
                                  , yes: function () {
                                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引

                                    parent.layer.close(index); //再执行关闭
                                  }
                                });
                              } else {
                                layer.msg(resp.retMsg);
                              }
                            }
                          });
                        }
                        , btn2: function () {
                          layer.closeAll();
                        }
                      });
                    } else {
                      layer.msg("获取基站异常：" + resp.retMsg);
                    }
                  },
                  error: function (resp) {
                    console.info(JSON.stringify(resp));
                    layer.msg("获取基站异常" + resp.msg);
                  }
                });
              }
              , btn2: function () {
                layer.closeAll();
              }
            });
          }
        }
        // 添加DOM元素到地图中
        map.getContainer().appendChild(div);
        // 将DOM元素返回
        return div;
      }
      // 创建控件
      var myZoomCtrl = new ZoomControl();
      // 添加到地图当中
      map.addControl(myZoomCtrl);

      /*创建清除按钮*/
      function clearControl () {
        // 默认停靠位置和偏移量
        this.defaultAnchor = BMAP_ANCHOR_TOP_RIGHT;
        this.defaultOffset = new BMap.Size(60, 80); // 距离左上角位置
      }
      clearControl.prototype = new BMap.Control();
      clearControl.prototype.initialize = function (map) {
        var div = document.createElement("div");
        div.appendChild(document.createTextNode("清除"));
        div.style.cursor = "pointer";
        div.style.border = "1px solid gray";
        div.style.backgroundColor = "white";
        div.style.width = "55px";
        div.style.height = "45px";
        div.style.textAlign = 'center';
        div.style.backgroundColor = '#2e84b5';
        div.style.color = '#ededed';
        div.style.lineHeight = '45px';
        div.style.textAlign = 'center';
        div.style.borderRadius = '10px';
        div.onclick = function (e) {
          clearAll();
        }
        map.getContainer().appendChild(div);
        return div;
      }
      var myClearCtrl = new clearControl();
      map.addControl(myClearCtrl);

      var overlaycomplete = function (e) {
        e.overlay.enableEditing();
        //圆
        if (e.drawingMode === BMAP_DRAWING_CIRCLE) {
          circleOverlays.push(e.overlay);
          console.info(e.overlay.getCenter().lng + "," + e.overlay.getCenter().lat + "+" + e.overlay.getRadius());
        }
        //矩形
        if (e.drawingMode === BMAP_DRAWING_RECTANGLE) {
          rectangleOverlays.push(e.overlay);

        }
        //多边形
        if (e.drawingMode === BMAP_DRAWING_POLYGON) {
          rectangleOverlays.push(e.overlay);
        }
      };
      var styleOptions = {
        strokeColor: "blue",    //边线颜色。
        fillColor: "blue",      //填充颜色。当参数为空时，圆形将没有填充效果。
        strokeWeight: 3,       //边线的宽度，以像素为单位。
        strokeOpacity: 0.8,	   //边线透明度，取值范围0 - 1。
        fillOpacity: 0.6,      //填充的透明度，取值范围0 - 1。
        strokeStyle: 'solid' //边线的样式，solid或dashed。
      }
      //实例化鼠标绘制工具
      var drawingManager = new BMapLib.DrawingManager(map, {
        isOpen: false, //是否开启绘制模式
        enableDrawingTool: true, //是否显示工具栏
        drawingToolOptions: {
          anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
          offset: new BMap.Size(120, 80), //偏离值
          drawingModes: [
            BMAP_DRAWING_CIRCLE,
            BMAP_DRAWING_POLYGON,
            BMAP_DRAWING_RECTANGLE
          ]
        },
        circleOptions: styleOptions, //圆的样式
        polygonOptions: styleOptions, //多边形的样式
        rectangleOptions: styleOptions //矩形的样式
      });
      //添加鼠标绘制工具监听事件，用于获取绘制结果
      drawingManager.addEventListener('overlaycomplete', overlaycomplete);
      //drawingManager.setTop('true');
      function clearAll () {
        for (var i = 0; i < circleOverlays.length; i++) {
          map.removeOverlay(circleOverlays[i]);
        }
        circleOverlays.length = 0;
        for (var i = 0; i < rectangleOverlays.length; i++) {
          map.removeOverlay(rectangleOverlays[i]);
        }
        latitudeAndLongitudeValueArr.length = 0;
        rectangleOverlays.length = 0;
      }
    };

    $(document).ready(function () {
      initialFunc();
    });


    //获取多边形经纬度合集
    function getPoints (polygon) {
      var latitudeAndLongitudeValue = "";
      var path = polygon.getPath();
      for (i = 0; i < path.length; i++) {
        if (i === path.length - 1) {
          latitudeAndLongitudeValue += path[i].lng + "," + path[i].lat;
          return latitudeAndLongitudeValue;
        }
        latitudeAndLongitudeValue += path[i].lng + "," + path[i].lat + "+";
      }
      return latitudeAndLongitudeValue;
    }
    //创建数据树
    tree.render({
      elem: '#test12' //默认是点击节点可进行收缩
      , data: treeData
      , edit: false
      , id: 'demoId1'
      , showCheckbox: true  //是否显示复选框
    });

    var colorArray = ["#1F82EE", "#7D7D7D", "#E98E20", "#1DD73A", "#1CE5BF", "#7D22E3", "#E131BF", "#EC1F1F"];
    $('#determine').on('click', function () {
      clearLinePointNames();
      var oCks = [];
      oCks = tree.getChecked("demoId1");
      for (let i = 0; i < oCks.length; i++) {
        var color = colorArray[i % 8];
        var children = oCks[i].children;
        var oCksNames = [];
        linePointNames.push(oCksNames);

        for (let k = 0; k < children.length; k++) {
          var linePointName = oCks[i].title + "-" + children[k].title;
          oCksNames.push(linePointName);
          pointName.push(linePointName);
          //console.info(linePointName);
          // 添加事件
          // function addMarker(e,ee,polygon){
          //     polygon.setFillOpacity(0.3);
          //     polygon.setFillColor(polygon.getStrokeColor());
          //     if (pointName.indexOf(linePointNames[i][k]) === -1){
          //         pointName.push(linePointNames[i][k]);
          //     }
          // }
          // //删除事件
          // function removeMarker(e,ee,polygon){
          //     polygon.setFillColor("transparent");
          //     if (pointName.indexOf(linePointNames[i][k]) === -1){
          //     } else {
          //         pointName.splice(pointName.indexOf(linePointNames[i][k]),1);
          //     }
          // }
          var points = [];
          var pointItude = [];
          pointItude = children[k].field.split('+');
          for (let j = 0; j < pointItude.length; j++) {
            var itude = [];
            itude = pointItude[j].split(',');
            points.push(new BMap.Point(itude[0], itude[1]))
          }
          var polygon = new BMap.Polygon(points,
            {
              strokeColor: color,
              fillColor: color,
              fillOpacity: 0.3,
              strokeWeight: 4,
              strokeOpacity: 1
            }); //创建多边形
          //创建右键菜单
          // var menu=new BMap.ContextMenu();
          //
          // menu.addItem(new BMap.MenuItem("选中当前点位",addMarker.bind(polygon)));
          // menu.addItem(new BMap.MenuItem("删除当前点位",removeMarker.bind(polygon)));
          // polygon.addContextMenu(menu);
          map.addOverlay(polygon);
          pointsOverlays.push(polygon);
          //创建点位标注
          var opts = {
            position: points[0],    // 指定文本标注所在的地理位置
            offset: new BMap.Size(0, 0)    //设置文本偏移量
          };
          var label = new BMap.Label(linePointName, opts);  // 创建文本标注对象
          label.setStyle({
            backgroundColor: color,
            color: "white",
            fontSize: "12px",
            height: "20px",
            lineHeight: "20px",
            fontFamily: "微软雅黑",
            borderRadius: "8px",
            paddingLeft: "5px",
            paddingRight: "5px",
            border: "0"
          });
          map.addOverlay(label);
          pointsOverlays.push(label)
        }
      }
      console.log(linePointNames);
    });
    $('#clearPoints').on('click', function () {
      $("#inputs-name").val("");
      treeData = test("");
      //重载实例
      tree.reload('demoId1', {
        elem: '#test12' //默认是点击节点可进行收缩
        , data: treeData
        , edit: false
        , showCheckbox: true  //是否显示复选框
        , oncheck: function (obj) {
        }
      });
      clearLinePointNames();
    });
    function clearLinePointNames () {
      for (let i = 0; i < pointsOverlays.length; i++) {
        map.removeOverlay(pointsOverlays[i]);
      }
      pointName.length = 0;
      pointsOverlays.length = 0;
    }


    //$(".personContent").eq(1).hide();
    $(".personType").eq(0).addClass('personChoosed');
    $(".personType").on('click', function () {
      if ($(this).index() == 0) {
        //clearRangePersonOverlay();
      } else {
        //clearPersonOverlay();
      }
      $(".personType").removeClass('personChoosed');
      $(".personContent").hide();
      $(this).addClass('personChoosed');
      $(".personContent").eq($(this).index()).css('display', 'block');
    });


    $('#clearPerson').on('click', function () {
      designatedPersonnel('');
      clearPersonOverlay();
    });
    $('#clearRangePerson').on('click', function () {
      $("#ulzbPersonLists").html("");
      clearRangePersonOverlay();
    });

    function clearPersonOverlay () {
      assignPersonPoints.forEach((items, index) => {
        map.removeOverlay(items);
      });
      assignPersonPoints.length = 0;
    }

    function clearRangePersonOverlay () {
      circles.forEach((items, index) => {
        map.removeOverlay(items)
      });
      circles.length = 0;
      referencePointArr.forEach((items, index) => {
        map.removeOverlay(items)
      });
      referencePointArr.length = 0;

      assignRangePersonPoints.forEach((items, index) => {
        map.removeOverlay(items);
      });
      assignRangePersonPoints.length = 0;
    }

    $('.referencePoint').on('click', function () {
      map.addEventListener("click", function (e) {
        if (referencePointArr.length === 0) {
          var marker = new BMap.Marker(e.point);  // 创建标注
          map.addOverlay(marker);               // 将标注添加到地图中
          marker.setAnimation(BMAP_ANIMATION_BOUNCE);//跳动的动画
          //marker.enableDragging();//可拖拽
          console.info(marker.getPosition().lng + "," + marker.getPosition().lat);
          referencePointArr.push(marker);
        }
      });
    });

  });
</script>